@import "../styles/input";
@import "../../assets/iconfont/iconfont";

cc-pagination {
	display: inline-block;
}

.pagination {
	> * {
		display: inline-block;
		vertical-align: middle;
		margin: 0 5px;
		&:first-child {
			margin-left: 0;
		}
		&:last-child {
			margin-right: 0;
		}
	}
	a {
		@extend .iconfont;
		padding: 3px;
		text-decoration: none;
		color: #929292;
		cursor: pointer;
		overflow: hidden;

		&%disabled {
			color: #d1d1d1;
			cursor: not-allowed;
		}

		@at-root .first-page#{&} {
			&.first, &.previous {
				@extend %disabled;
			}
		}
		@at-root .last-page#{&} {
			&.next, &.last {
				@extend %disabled;
			}
		}

		&:hover {
			color: #828282;
		}

		&.first {
			@extend .icon-lastpage;
			transform: rotate(180deg);
		}
		&.previous {
			@extend .icon-nextpage;
			transform: rotate(180deg);
		}
		&.next {
			@extend .icon-nextpage;
		}
		&.last {
			@extend .icon-lastpage;
		}

		> span {
			display: inline-block;
			direction: ltr;
			text-align: left;
			text-indent: -99999px;
		}
	}
	.jump input {
		height: 26px;
		width: auto;
		min-width: 36px;
		margin: 0 3px;
		padding: 0 4px;
		text-align: center;
	}
	select {
		width: auto;
		height: 26px;
		line-height: 18px;
		padding: 0;
	}
}

